<template>
   <el-tabs class="demo-tabs" v-model="activeTab" @tab-click="handleTabClick" >
    <el-tab-pane  label="获取单页文章" name="first"><GetSingleNotePage/></el-tab-pane>
<!--    <el-tab-pane  label="获取推荐" name="second"><GetRecommendNotesPage/></el-tab-pane>-->
    <el-tab-pane  label="根据关键词获取内容" name="three"><GetNotesByKeyword/></el-tab-pane>
    <el-tab-pane  label="根据发布者id爬取所有笔记" name="four"><GetAllNotesByPosterId/></el-tab-pane>

<!--    <el-tab-pane label="关键词搜索笔记" name="third">Role</el-tab-pane>-->
<!--    <el-tab-pane label="Task" name="fourth">Task</el-tab-pane>-->
<!--    <component v-bind:is="currentTabName" @close="handleSubClose" ></component>-->
  </el-tabs>

</template>

<script setup>
import GetSingleNotePage from "@/views/xhs/GetSingleNotePage.vue";
import {ref} from "vue";
import GetRecommendNotesPage from "@/views/xhs/GetRecommendNotesPage.vue";
import GetNotesByKeyword from "@/views/xhs/GetNotesByKeyword.vue";
import GetAllNotesByPosterId from '@/views/xhs/GetAllNotesByPosterId.vue'
const activeTab = ref('first');

const handleTabClick = (tab) => {
  if (activeTab.value !== tab.name) {
    activeTab.value = tab.name;
    // 在更新 activeTab 后执行其他操作
    // 使用 $nextTick 来确保更新已经完成
    // 这样可以避免触发递归更新

  }
};
</script>

<style>

</style>